body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
}

/*常规模式配置*/
body[class=normal] {
  /*边框颜色*/
  --border-color-two: rgba(0, 0, 0, 0.5);
  --border-color-three: rgba(0, 0, 0, 0.33);
  --border-color-six: rgba(0, 0, 0, 0.063);
  --border-color-seven: red;

  /*字体颜色*/
  --font-five: rgb(61, 60, 60);
  --font-six: rgba(0, 0, 0, 0.7);
  --font-seven: rgb(71, 141, 245);
  --font-eight: rgb(125, 164, 227);
  --font-nine: rgb(106, 179, 242);
  --font-ten: rgba(0, 0, 0, 0.6);
  --font-eleven: #555666;
  --font-twelve: #222226;
  --font-thirteen: rgb(77, 75, 75);
  --font-fourteen: rgb(86, 84, 84);
  --font-fifteen: rgb(245, 191, 99);

  /*背景颜色*/
  --bg-color-one: rgba(240, 248, 255, 0.332);
  --bg-color-three: rgb(106, 179, 242);
  --bg-color-four: rgba(240, 248, 255, 0.7);
  --bg-color-five: rgba(240, 248, 255, 0.4);
  --bg-color-six: aliceblue;
  --bg-color-seven: rgb(106, 159, 228);
  --bg-color-nine: rgba(255, 252, 252, 0.8);
  --bg-color-ten: rgba(255, 255, 255, 0.33);
  --bg-color-eleven: rgba(125, 125, 125, 0.1);
  --bg-color-twelve: rgba(255, 255, 255, 1);

  /*常规字体颜色*/
  --normal-font-color: black;
  --danger-font-color: red;
  --ordinary-font-color: rgb(71, 141, 245);
  --one-font-color: rgb(129, 136, 136);
  --two-font-color: white;

  /*常规背景颜色*/
  --bg-one-color: white;
  --bg-two-color: rgb(71, 141, 245);
  --bg-three-color: #eb6161;
  --bg-four-color: rgba(248, 249, 251, 0.8);
  --bg-five-color: rgba(0, 0, 0, 0.7);

  /*常规边框颜色*/
  --border-one-color: white;
  --boder-two-color: black;
  --boder-three-color: rgb(71, 141, 245);
  --boder-four-color: rgb(191, 187, 187);

  /*basicWidget*/
  --basicWidget-bg-color: white;
  --basicWidget-prefix-bg-color: rgba(125, 125, 125, 0.1);

  --basicWidget-boder-color: rgba(0, 0, 0, 0.33);
  --basicWidget-focus-boder-color: rgb(71, 141, 245);
  --basicWidget-false-boder-color: red;

  --basicWidget-prefix-font-color: rgba(0, 0, 0, 0.7);
  --basicWidget-suffix-font-color: rgb(129, 136, 136);
  --basicWidget-suffix-hover-font-color: rgb(61, 60, 60);
  --basicWidget-font-color: black;
  --checkBoxWidget-font-color: white;

  /*Button*/
  --button-bg-color: rgb(71, 141, 245);
  --button-font-color: white;
}

/*深色模式配置*/
body[class=dark] {
  /*边框颜色*/
  --border-color-two: rgba(0, 0, 0, 0.5);
  --border-color-three: rgba(0, 0, 0, 0.33);
  --border-color-six: rgba(0, 0, 0, 0.063);
  --border-color-seven: red;

  /*字体颜色*/
  --font-five: white;
  --font-six: white;
  --font-seven: white;
  --font-eight: white;
  --font-nine: white;
  --font-ten: white;
  --font-eleven: white;
  --font-twelve: white;
  --font-thirteen: white;
  --font-fourteen: white;
  --font-fifteen: rgb(245, 191, 99);

  /*背景颜色*/
  --bg-color-one: black;
  --bg-color-three: black;
  --bg-color-four: black;
  --bg-color-five: black;
  --bg-color-six: black;
  --bg-color-seven: black;
  --bg-color-nine: black;
  --bg-color-ten: black;
  --bg-color-eleven: black;
  --bg-color-twelve: black;

  /*常规*/
  --normal-font-color: white;
  --danger-font-color: red;
  --ordinary-font-color: white;
  --one-font-color: rgb(126, 119, 119);
  --two-font-color: white;

  /*常规背景颜色*/
  --bg-one-color: black;
  --bg-two-color: rgb(71, 141, 245);
  --bg-three-color: #eb6161;
  --bg-four-color: rgba(248, 249, 251, 0.8);
  --bg-five-color: rgba(0, 0, 0, 0.7);

  /*常规边框颜色*/
  --border-one-color: white;
  --boder-two-color: white;
  --boder-three-color: rgb(71, 141, 245);
  --boder-four-color: rgb(191, 187, 187);

  /*basicWidget*/
  --basicWidget-bg-color: black;
  --basicWidget-prefix-bg-color: rgba(130, 130, 130, 0.1);

  --basicWidget-boder-color: rgba(255, 255, 255, 0.33);
  --basicWidget-focus-boder-color: white;
  --basicWidget-false-boder-color: red;

  --basicWidget-prefix-font-color: rgba(255, 255, 255, 0.7);
  --basicWidget-suffix-font-color: rgb(126, 119, 119);
  --basicWidget-suffix-hover-font-color: rgb(194, 195, 195);
  --basicWidget-font-color: white;
  --checkBoxWidget-font-color: black;

  /*Button*/
  --button-bg-color: white;
  --button-font-color: black;

  color: white
}

/*简约模式配置*/
body[class=simple] {
  /*边框颜色*/
  --border-color-two: rgba(0, 0, 0, 0.5);
  --border-color-three: rgba(0, 0, 0, 0.33);
  --border-color-six: rgba(0, 0, 0, 0.063);
  --border-color-seven: red;

  /*字体颜色*/
  --font-five: rgb(61, 60, 60);
  --font-six: rgba(0, 0, 0, 0.7);
  --font-seven: black;
  --font-eight: black;
  --font-nine: black;
  --font-ten: rgba(0, 0, 0, 0.6);
  --font-eleven: #555666;
  --font-twelve: #222226;
  --font-thirteen: rgb(77, 75, 75);
  --font-fourteen: rgb(86, 84, 84);
  --font-fifteen: rgb(245, 191, 99);

  /*背景颜色*/
  --bg-color-one: white;
  --bg-color-three: white;
  --bg-color-four: white;
  --bg-color-five: white;
  --bg-color-six: white;
  --bg-color-seven: white;
  --bg-color-nine: white;
  --bg-color-ten: white;
  --bg-color-eleven: white;
  --bg-color-twelve: white;

  /*常规背景颜色*/
  --bg-one-color: white;
  --bg-two-color: rgb(71, 141, 245);
  --bg-three-color: #eb6161;
  --bg-four-color: rgba(248, 249, 251, 0.8);
  --bg-five-color: rgba(0, 0, 0, 0.7);

  /*常规边框颜色*/
  --border-one-color: black;
  --boder-two-color: black;
  --boder-three-color: rgb(71, 141, 245);
  --boder-four-color: rgb(191, 187, 187);

  /*常规*/
  --normal-font-color: black;
  --danger-font-color: red;
  --ordinary-font-color: black;
  --one-font-color: rgb(129, 136, 136);
  --two-font-color: black;

  /*basicWidget*/
  --basicWidget-bg-color: white;
  --basicWidget-prefix-bg-color: rgba(125, 125, 125, 0.1);

  --basicWidget-boder-color: rgba(0, 0, 0, 0.33);
  --basicWidget-focus-boder-color: black;
  --basicWidget-false-boder-color: red;

  --basicWidget-prefix-font-color: rgba(0, 0, 0, 0.7);
  --basicWidget-suffix-font-color: rgb(129, 136, 136);
  --basicWidget-suffix-hover-font-color: rgb(61, 60, 60);
  --basicWidget-font-color: black;
  --checkBoxWidget-font-color: white;

  /*Button*/
  --button-bg-color: black;
  --button-font-color: white;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}

/*定义滚动条高宽及背景
高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
  background-color: var(--bg-one-color);
}

/*定义滚动条轨道
内阴影+圆角*/
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px var(--bg-one-color);
  border-radius: 6px;
  background-color: var(--bg-one-color);
}

/*定义滑块
内阴影+圆角*/
::-webkit-scrollbar-thumb {
  border-radius: 6px;
  -webkit-box-shadow: inset 0 0 6px var(--bg-one-color);
  background-color: var(--bg-two-color)
}

/* 自定义提示信息 */
[data-tooltip-left],
[data-tooltip-right],
[data-tooltip-top],
[data-tooltip-bottom] {
  position: relative;
  display: inline-block;
}

/* 隐藏原生的 title 工具提示 */
[data-tooltip-left]:hover::before {
  content: attr(data-tooltip-left);
  position: absolute;
  /* 调整这个值以改变工具提示的位置 */
  right: 100%;
  margin-right: 5px;
  top: 50%;
  transform: translateY(-50%);

  padding: 4px 8px;
  background-color: var(--bg-five-color);
  color: white;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 100000;
}

/* 隐藏原生的 title 工具提示 */
[data-tooltip-right]:hover::before {
  content: attr(data-tooltip-right);
  position: absolute;
  /* 调整这个值以改变工具提示的位置 */
  left: 100%;
  margin-left: 5px;
  top: 50%;
  transform: translateY(-50%);

  padding: 4px 8px;
  background-color: var(--bg-five-color);
  color: white;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 100000;
}

/* 隐藏原生的 title 工具提示 */
[data-tooltip-bottom]:hover::before {
  content: attr(data-tooltip-bottom);
  position: absolute;
  /* 调整这个值以改变工具提示的位置 */
  top: 100%;
  margin-top: 5px;
  left: 50%;
  transform: translateX(-50%);

  padding: 4px 8px;
  background-color: var(--bg-five-color);
  color: white;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 100000;
}

/* 隐藏原生的 title 工具提示 */
[data-tooltip-top]:hover::before {
  content: attr(data-tooltip-top);
  position: absolute;
  /* 调整这个值以改变工具提示的位置 */
  bottom: 100%;
  margin-bottom: 5px;
  left: 50%;
  transform: translateX(-50%);

  padding: 4px 8px;
  background-color: var(--bg-five-color);
  color: white;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 100000;
}

.ant-message {
  font-size: 1.5em !important;
}

.ant-message svg {
  width: 1.5em;
  height: 1.5em;
}

/**
 * 组件禁用样式
 */
.widget-disabled {
  background-color: var(--basicWidget-prefix-bg-color) !important;
  border-radius: 0% !important;
}



.date-widget-main, .inputWidget-mainDiv {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.date-widget-input, .inputWidget-inputDiv {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
  background-color: var(--basicWidget-bg-color);
  border-radius: 3px;
  border: 1px solid var(--basicWidget-boder-color);
}

.date-widget-input-content, .inputWidget-input {
  padding: 0.5em;
  font-size: 1em;
  outline: none;
  border: none;
  border-radius: 3px;
  flex: 1;
  width: 100%;
  color: var(--normal-font-color);
  background-color: var(--basicWidget-bg-color);
  font-family: inherit;
}

.date-widget-input:focus-within, .inputWidget-inputDiv:focus-within {
  border-color: var(--basicWidget-focus-boder-color);
}

.date-widget-input:hover, .inputWidget-inputDiv:hover {
  border-color: var(--basicWidget-focus-boder-color);
}

.date-widget-message, .inputWidget-messageDiv {
  display: flex;
  word-wrap: break-word;
  word-break: break-all;
  color: var(--danger-font-color);
  font-size: 1em;
  font-weight: bolder;
}

.date-widget-suffix, .inputWidget-suffix {
  padding: 0.5em;
}

.date-widget-suffix span, .inputWidget-suffix span {
  color: var(--basicWidget-suffix-font-color);
}

.date-widget-suffix span:hover, .inputWidget-suffix span:hover {
  color: var(--basicWidget-suffix-hover-font-color);
  cursor: pointer;
}

.date-widget-prefix, .inputWidget-prefix {
  padding: 0.5em;
  border-right: 1px solid var(--basicWidget-boder-color);
  background-color: var(--basicWidget-prefix-bg-color);
  color: var(--basicWidget-prefix-font-color);
}

input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
}
